<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>显示商品</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/css/common.css" media="all">
    <link rel="stylesheet" href="/js/layui/css/layui.css" media="all">
    <script src="/js/layui/layui.all.js"></script>
</head>
<body>
<script type="text/html" id="caozuo">
    {{#  if (d.gstatus == 0) {  }}
    <input type="button" value="上架" class="layui-btn layui-btn-sm" lay-event="up"/>
    {{# } else if(d.gstatus == 1){  }}
    <input type="button" value="下架" class="layui-btn layui-btn-sm" lay-event="down"/>
    {{# } }}
    {{#  if (d.tuijian == 0) {  }}
    <input type="button" value="推荐" class="layui-btn layui-btn-sm" lay-event="tuiup"/>
    {{# } else if(d.tuijian == 1){  }}
    <input type="button" value="取消推荐" class="layui-btn layui-btn-sm" lay-event="tuidown"/>
    {{# } }}
    <input type="button" value="编辑" class="layui-btn layui-btn-sm" lay-event="edit"/>
    <input type="button" value="删除" class="layui-btn layui-btn-sm" lay-event="delete"/>
</script>
<style>
    .layui-table-cell{
        height:60px;
        line-height:60px;
    }
    .layui-input-block{
        margin-left: 120px !important;
    }
</style>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-form layui-card-header layuiadmin-card-header-auto">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <div class="layui-form">
                        <div class="layui-form-item">
                            <label class="layui-form-label" >商品名称</label>
                            <div class="layui-input-inline">
                                <input type="text" class="layui-input" id="name" placeholder="">
                            </div>
                        </div>
                    </div>
                </div>

                <div class="layui-inline">
                    <div class="layui-form">
                        <div class="layui-form-item">
                            <label class="layui-form-label" >是否上架</label>
                            <div class="layui-input-inline">
                                <select id="status" name="status">
                                    <option value="-1" >不限</option>
                                    <option value="1" >在架</option>
                                    <option value="0" >下架</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-inline">
                    <div class="layui-form">
                        <div class="layui-form-item">
                            <label class="layui-form-label">是否推荐</label>
                            <div class="layui-input-inline">
                                <select id="tuijian" name="tuijian">
                                    <option value="-1">不限</option>
                                    <option value="1">已推荐</option>
                                    <option value="0">不推荐</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-inline">
                    <button style="margin-left: 50px" id="btnSearch" class="layui-btn layuiadmin-btn-admin" type="button"
                            lay-filter="LAY-user-back-search" >
                        <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>搜索
                    </button>
                </div>

                <div style="float: right;margin-right: 10px">
                    <button style="margin-left: 5px;" class="layui-btn layuiadmin-btn-admin" type="button" lay-filter="LAY-user-back-search" id="uploadexcel">批量导入</button>
                </div>

            </div>

        </div>
    </div>
</div>
<table id="t" lay-filter="t" style="width: 100%">
</table>
</body>
</html>

<script type="text/html" id="checkboxTpl">
    <input type="checkbox" name="tuijian" value="{{d.gid}}" title="是" lay-filter="lockDemo" {{ d.tuijian == 1 ? 'checked' : '' }}>
</script>
<script type="text/html" id="checkboxtuihuo">
    <input type="checkbox" name="qitianwuliyou" value="{{d.gid}}" title="支持" lay-filter="lockDemoTuihuo" {{ d.qitianwuliyou == 1 ? 'checked' : '' }}>
</script>
<script src="/admin/js/parsejson.js"></script>
<script>
    var $ = layui.$;
    var form = layui.form;
    var table = layui.table;
    var upload = layui.upload;

    table.render({
        url:'/goods/searchGoods',
        id:'tt',
        elem:'#t',
        parseData:function(res) {
            res = json.parse(res);
            for(var i in res.data) {
                res.data[i].areacenter = {};
            }
            return res
        },
        cols: [[
            {title: "序号", width: "80", align: "center", fixed: "left",type:'numbers'},
            {title: '商品名称',field: 'gname',width: '250',align: 'center'},
            {title: '折扣价(美元)',field: 'gprice_en',width: '120',align: 'center',templet:function (d) {
                    return d.gprice_en!=null && d.gprice_en!="" ? d.gprice_en : "未设置美元价格";
                }},
            {title: '商品类型',field: 'gtype',width: '150',align: 'center', templet: function (res) {
                    return res.goodsType.gname
                }},
            {title: '库存',field: 'gkucun',width: '80',align: 'center',sort:true},
            {title: '单位',field: 'gdanwei',width: '80',align: 'center'},
            {title: '简介',field: 'gjianjie',width: '250',align: 'center'},
            {field: 'gImages', title: "图片", width: "100", align: "center",templet: function (d) {
                    return d.gpicture==null || d.gpicture=='' ? "<img style='object-fit:contain;' height='60px' src='/image/no.jpg' >" : "<img style='object-fit:contain;' height='60px' src='/"+d.gpicture+"'>";
                }},
            {field: 'weights',title: '权重',width: "100",align: "center",sort: true},
            {title: '状态',field: 'gStatus',width: '100',align: 'center',templet: function (d) {
                    return d.gstatus == 0 ? "<span style='color: red'>已下架</span>" :  "<span style='color: green'>已上架</span>"
                }},
            {title: '推荐',field: 'tuijian',width: '100',align: 'center',templet: function (d) {
                    return d.tuijian == 0 ? "<span style='color: red'>不推荐</span>" :  "<span style='color: green'>推荐</span>"
                }}
            ,{fixed:"right",title: "操作", align: "center", toolbar: '#caozuo',width: 290}
        ]],
        page:true,
        page: {
            curr: layui.data("thaitrade_goods_page").index
        },
        done: (res, curr, count) => {
            layui.data("thaitrade_goods_page", {
                key: 'index',
                value: curr
            });
        }
    });

    //    右侧按钮的的监听事件
    table.on('tool(t)', function (obj) {
        var getdata = obj.data //获得当前行数据
        var layEvent = obj.event //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
        var tr = obj.tr //获得当前行 tr 的 DOM 对象（如果有的话）
        switch (layEvent) {
            case 'up':
                layer.confirm("确定要上架?",["确定","取消"],function(){
                    $.ajax({
                        url:'/goods/goodsUp',
                        data:{gid:getdata.id},
                        success:function(data){
                            if (data.code==200)
                            {
                                layer.msg("上架成功",{icon:1,time:1000},function(){
                                    location.reload()
                                });
                            }else{
                                layer.msg(data.msg,{icon:1,time:1000});
                            }
                        }
                    })
                });
                break;
            case 'down':
                layer.confirm("确定要下架?",["确定","取消"],function(){
                    $.ajax({
                        url:'/goods/goodsDown',
                        data:{gid:getdata.id},
                        success:function(data){
                            if (data.code==200)
                            {
                                layer.msg("下架成功",{icon:1,time:1000},function(){
                                    location.reload()
                                });
                            }else{
                                layer.msg(data.msg,{icon:1,time:1000});
                            }
                        }
                    })
                });break;
            case 'tuiup':
                layer.confirm("确定推荐该商品?",["确定","取消"],function(){
                    $.ajax({
                        url:'/goods/tuiUp',
                        data:{gid:getdata.id},
                        success:function(data){
                            if (data.code==200)
                            {
                                layer.msg("成功推荐",{icon:1,time:1000},function(){
                                    location.reload()
                                });
                            }else{
                                layer.msg(data.msg,{icon:2,time:1000});
                            }
                        }
                    })
                });
                break;
            case 'tuidown':
                layer.confirm("确定取消该推荐?",["确定","取消"],function(){
                    $.ajax({
                        url:'/goods/tuiDown',
                        data:{gid:getdata.id},
                        success:function(data){
                            if (data.code==200)
                            {
                                layer.msg("取消成功",{icon:1,time:1000},function(){
                                    location.reload()
                                });
                            }else{
                                layer.msg(data.msg,{icon:2,time:1000});
                            }
                        }
                    })
                });
                break;
            case "edit":
                location = "/admin/goods/updateGoods.html?id="+getdata.id+"&gtypeid="+getdata.goodsType.id;
                break;
            case "delete":
                layer.confirm("确定删除该商品?",["确定","取消"],function(){
                    $.ajax({
                        url:'/goods/deleteById',
                        data:{id:getdata.id},
                        success:function(data){
                            if (data.code==200)
                            {
                                layer.msg("删除成功",{icon:1,time:1000},function(){
                                    location.reload()
                                });
                            }else{
                                layer.msg(data.msg,{icon:2,time:1000});
                            }
                        }
                    })
                });
                break;
        }
    });

    var form = layui.form;
    form.render('select');

    function search(){
        table.reload('tt', {
            where: {
                name: $("#name").val(),
                status: $("#status").val(),
                tuijian: $("#tuijian").val()
            },
            page: {curr: 1}
        });
    }

    $("#btnSearch").click(function () {
        search();
    });

    // 关键词搜索框添加绑定回车函数
    $('#name').bind('keypress', function(event) {
        search();
    });

    $("#uploadexcel").on("click",function () {
        layer.open({
            type: 2,
            title:'excel批量导入',
            area: ['300px', '250px'],
            content: 'importGoodsByExcel.html',
            end: function(){
                location.reload();
            }
        });
    })

</script>